document.addEventListener('DOMContentLoaded', function() {
    const form = document.querySelector('form');
    if (!form) return;

    form.addEventListener('submit', async function(e) {
        e.preventDefault();

        // 收集表单字段
    const fd = new FormData(form);
    const username = (fd.get('username') || '').trim();
    // 兼容 Django 表单字段名：优先使用 password，其次使用 password1
    const password1 = ((fd.get('password') || fd.get('password1')) || '').trim();
    // 确认密码字段（常见名：password2 / confirm_password）
    const password2 = ((fd.get('password2') || fd.get('confirm_password') || fd.get('password_confirm')) || '').trim();
    const nickname = (fd.get('nickname') || '').trim();
    const avatar_url = (fd.get('avatar_url') || '').trim();
    const genderRaw = (fd.get('gender') || '').trim().toLowerCase();
    const phone = (fd.get('phone') || '').trim();
    const email = (fd.get('email') || '').trim();
    const bio = (fd.get('bio') || '').trim();

    // 将性别映射为后端SQLite schema要求的枚举文本
    // 允许的取值：'male' | 'female' | 'unknown'
    // 性别下拉只提供 male/female，未选择则默认 'unknown'（符合后端 CHECK 约束）
    const genderMap = { 'male': 'male', 'female': 'female' };
    const gender = genderMap[genderRaw] || 'unknown';

        // HTML 风格的用户名/密码校验（非空、长度、字符规则、密码强度等）
        const usernameErr = validateUsername(username);
        if (usernameErr) {
            showErrorMessage(usernameErr);
            return;
        }

        const passwordErr = validatePassword(password1);
        if (passwordErr) {
            showErrorMessage(passwordErr);
            return;
        }

        // 先做密码一致性校验
        if ((password1 || password2) && password1 !== password2) {
            showErrorMessage('密码和确认密码不一致，请检查后重试');
            return;
        }

        // 生成 request_id 与 user_id（示例：时间戳）
    const now = new Date();
    const request_id = `req-${now.getTime()}`;
  //  const user_id = `user-${now.getTime()}`;

        // 对密码进行 SHA-256 哈希（如果用户输入了密码）
        let password_hash = null;
        if (password1) {
            try {
                password_hash = await hashPassword(password1);
            } catch (err) {
                console.error('密码哈希失败:', err);
                showErrorMessage('处理密码时出现错误，请重试');
                return;
            }
        }

        // 构造后端要求的 JSON（与 coordinator_main.go 中 receiveString 结构一致）
        const payload = {
            request_id: request_id,
            operation: 'insert',
            database: 'short_video',
            table: 'user',
            data: {
                //user_id: user_id,
                username: username || null,
                // 仅发送哈希
                password_hash: password_hash || null,
                nickname: nickname || null,
                avatar_url: (avatar_url || null),
                gender: gender,                            // male/female 或 null
                bio: (bio || null),
                phone: (phone || null),
                email: (email || null),
                register_time: now.toISOString(),          // 避免 NOT NULL 失败
                last_login: null,
                status: 'active'
            }
        };

        try {
            const resp = await fetch('http://localhost:8080/api/request', {
                method: 'POST',
                headers: { 'Content-Type': 'application/json' },
                body: JSON.stringify(payload)
            });
            // 后端已改为：总是返回 200，业务失败时返回 {"success":false,"error":"..."}
            // 所以不再检查 resp.ok；只让真正的网络错误进入 catch
            const result = await resp.json();

            if (result && result.insert_success) {
                showSuccessMessage('注册成功！正在跳转到登录页面...');
                setTimeout(() => { window.location.href = '/accounts/login/'; }, 1500);
            } else {
                const msg = (result && (result.error || result.message)) || '注册失败，请重试';
                showErrorMessage(msg);
            }
        } catch (err) {
            console.error('注册请求失败:', err);
            showErrorMessage('网络错误，请检查连接后重试');
        }
    });
      function getCSRFToken() {
        const cookieValue = document.cookie
            .split('; ')
            .find(row => row.startsWith('csrftoken='))
            ?.split('=')[1];
        return cookieValue || '';
    }

    // 将明文密码做 SHA-256 哈希并返回十六进制字符串
    async function hashPassword(password) {
        if (!password) return null;
        const enc = new TextEncoder();
        const data = enc.encode(password);
        const hashBuffer = await crypto.subtle.digest('SHA-256', data);
        return bufferToHex(hashBuffer);
    }

    // ArrayBuffer -> hex string
    function bufferToHex(buffer) {
        const bytes = new Uint8Array(buffer);
        const hex = [];
        for (let i = 0; i < bytes.length; i++) {
            hex.push(bytes[i].toString(16).padStart(2, '0'));
        }
        return hex.join('');
    }

    // ======= 用户名与密码校验函数（HTML 上标注风格） =======
    function validateUsername(username) {
        // 假定规则：必填，长度 3-30，允许字母/数字/下划线/点/连字符
        if (!username) return '用户名不能为空';
        if (username.length < 3 || username.length > 30) return '用户名长度应为 3 到 30 个字符';
        const re = /^[A-Za-z0-9_.-]+$/;
        if (!re.test(username)) return '用户名只能包含字母、数字、下划线、点或连字符';
        return null;
    }

    function validatePassword(password) {
        // 假定规则：必填，最少 8 个字符，需包含字母和数字
        if (!password) return '密码不能为空';
        if (password.length < 8) return '密码至少需要 8 个字符';
        // 要求包含字母与数字以提高强度（可调整）
        if (!/[A-Za-z]/.test(password) || !/[0-9]/.test(password)) return '密码需包含字母和数字';
        return null;
    }
      function showSuccessMessage(message) {
        // 移除现有的消息框
        removeExistingMessages();
        
        const successDiv = document.createElement('div');
        successDiv.className = 'alert alert-success alert-dismissible fade show';
        successDiv.innerHTML = `
            <strong>成功！</strong> ${message}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        `;
        
        // 在表单前插入成功消息
        form.parentNode.insertBefore(successDiv, form);
    }
     // 显示错误消息的函数
    function showErrorMessage(message) {
        // 移除现有的消息框
        removeExistingMessages();
        
        const errorDiv = document.createElement('div');
        errorDiv.className = 'alert alert-danger alert-dismissible fade show';
        errorDiv.innerHTML = `
            <strong>错误！</strong> ${message}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        `;
        
        // 在表单前插入错误消息
        form.parentNode.insertBefore(errorDiv, form);
        
        // 自动聚焦到第一个输入框
        const firstInput = form.querySelector('input[type="text"], input[type="email"], input[type="password"]');
        if (firstInput) {
            firstInput.focus();
        }
    }
     // 移除现有消息框的函数
    function removeExistingMessages() {
        const existingAlerts = document.querySelectorAll('.alert');
        existingAlerts.forEach(alert => {
            alert.remove();
        });
    }
    
});
